<style lang = "stylus" scoped>
#appEntrance {
  width: 1000px;
  height: 1000px;
  position: relative;
  pointer-events: none;
  position:absolute;
  top:0px;
  left:0px
  z-index 1;
}

.flowBoxWarp {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px
  background: rgba(0, 0, 0, .5)
}

</style>

<template>
  <!-- 正常的内容 -->
  <div id = "appEntrance">
    <!-- 路由出口 -->
    <router-view v-slot = "{ Component }">
      <transition name = "fade">
        <component :is = "Component" />
      </transition>
    </router-view>
  </div>
  <!-- 推流地址 -->
  <div id = "player" class = "flowBoxWarp"></div>
</template>

<script setup lang = "ts">
import {nextTick, onBeforeUnmount, onMounted, reactive, watch,} from 'vue';
import {useRoute, useRouter} from "vue-router";
import {useStore, mapActions} from "vuex";
// import { ue4Init } from "zuue4web"
// @ts-ignore 解构ue4 API;
import {UE4Api} from "api";
// 引入路由
const _router = useRouter();
// 路由信息
const _route = useRoute();
// vuex对象
const _store = useStore();
// 引入State状态
const _state = _store.state;
// 响应式变量;
const _data = reactive({});

// 获取当前是否有token值
const token = sessionStorage.getItem("daxing_Airport_token") || "";
// 获取当前的登录信息
let userLoginInfo = sessionStorage.getItem("daxing_Airport_userLoginInfo") || "";
// 判断当前是否有登陆过
if (token) {
  _state.token = token;
  // 给window设置一个值;
  window["daxingAirport.token"] = token;

  _state.userLoginInfo = JSON.parse(userLoginInfo);
} else {
  // _router.push({
  //   path: '/'
  // })
}
// 初始化的ue4的对象
let ue4Config;
// vue钩子函数
onMounted(() => {
  // // 初始化ue4视频流
  // ue4Config =  new ue4Init({ url:import.meta.env.VITE_MOOE_UE4_IP,name:import.meta.env.VITE_MODE_PROJECT_NAME });
  // // 把ue4对象挂在到window上
  // if( ue4Config?.ue4 ) window["ue4"] = ue4Config.ue4;
  // // 点击视频流返回的事件
  // ue4Config.message = (ue4Date)=>{
  //   // 更新保存的点击数据
  //   _state.ue4ToData = ue4Date;
  // }
})
// 监听路由,设置当前路由的打开信息
watch(_route, (newVal) => {
  _data.currentNavName = newVal.meta.oneNavHighlightkey;
  // 把当前的路由信息记录在VueX里面
  _state.currentRouterInfo = newVal;
});
// 监听token值如果变成空的话则退出到登录页面
watch(() => _state.token,(count, prevCount) => {
      // if (!count)  _router.push({ path: '/' })
    }
)
// 监听当前屏幕的宽高
window.addEventListener("resize", screenWidthAndHeight);

/**
 * @author: 王琛
 * @description: 设置当前屏幕的宽高
 * @Date: 2021-11-25 09:32:20
 * @param {*}
 * @return {*}
 */
function screenWidthAndHeight() {
  const w = document.body.clientWidth;
  const h = document.body.clientHeight;
  _state.screenWH = {w, h};
  // 屏幕变动之后初始化echarts
  for (const reset of Object.values(_state.refreshEcharts)) {
    if (reset) reset();
  }
}
</script>


